<template>
    <section>
        <header>
            <div>
                <h1>Создать задачу</h1>
            </div>
        </header>
    </section>
    <section>
        <article>
            <div>
                <form @submit.prevent="store">
                    <div>
                        <label for="title">Название: </label>
                        <input id="title" v-model="form.title" type="text">
                    </div>
                    <div>
                        <label for="description">Описание: </label>
                        <input id="description" v-model="form.description" type="text">
                    </div>
                    <div>
                        <label for="priority">Приоритет: </label>
                        <input id="priority" v-model="form.priority" type="text">
                    </div>
                    <div>
                        <label for="deadline">Срок окончания: </label>
                        <input id="deadline" v-model="form.deadline" type="text">
                    </div>
                    <div>
                        <button type="submit">Добавить задачу</button>
                    </div>
                </form>
            </div>
        </article>
    </section>
    <section>
        <footer>
        </footer>
    </section>
</template>
<script setup>
import { reactive } from 'vue'
import { router } from '@inertiajs/vue3'

const form = reactive({
    title: null,
    description: null,
    priority: null,
    deadline: null,
})

function store() {
    router.post('/list', form)
}
</script>